/*
 * @Descripttion:
 * @version: 1.0.0
 * @Author: Shentong
 * @Date: 2021-04-09 12:34:34
 * @LastEditors: Shentong
 * @LastEditTime: 2021-12-03 16:29:02
 */
/**
 * @description 此页面暂时不用： TODO:
 */
// eslint-disable-next-line @typescript-eslint/no-use-before-define
 import React, { useEffect, useState, useRef } from "react";

 import Bezier from '@/utils/bezier'
 import { View } from "@tarojs/components";
 import styles from './index.module.scss'

 const FlyBall = (props) => {
  const { startXY, targetXY, showBall = false, moveFinish = () => {}} = props
  const [ballPosition, setBallPosition] = useState({top:-50,left: 0})

  const bezier = useRef({})

  useEffect(() => {

  }, [])

  useEffect(() => {
    moveFinish()
    // if (showBall) {
    //   bezier.current = new Bezier({
    //     targetPositionXY: targetXY,
    //     touchDomXY: {...startXY},
    //     setBallPosition,
    //   })
    //   bezier.current.doMove().then(res=> {
    //     moveFinish()
    //   })
    // }
  }, [startXY, targetXY])

   return (
     <React.Fragment>
       <View className={`${styles.moveBall} ${showBall ? styles.show : ''}`} style={ballPosition}></View>
     </React.Fragment>
   );
 }

 export default FlyBall
